Ext.define('Admin.view.authentication.Register', {
    extend: 'Admin.view.authentication.LockingWindow',
    xtype: 'register',

    requires: [
        'Admin.view.authentication.Dialog',
        'Ext.button.Button',
        'Ext.form.Label',
        'Ext.form.field.Checkbox',
        'Ext.form.field.Text'
    ],

    title: '用户注册',
    defaultFocus: 'authdialog', // Focus the Auth Form to force field focus as well

    items: [{
        xtype: 'authdialog',
        bodyPadding: '20 20',
        width: 455,
        reference: 'authDialog',

        defaultButton: 'submitButton',
        autoComplete: true,
        cls: 'auth-dialog-register',
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        defaults: {
            margin: '10 0',
            selectOnFocus: true
        },
        items: [{
                xtype: 'label',
                cls: 'lock-screen-top-label',
                text: 'Create an account'
            },
            {
                xtype: 'textfield',
                cls: 'auth-textbox',
                height: 55,
                hideLabel: true,
                allowBlank: false,
                name: 'username',
                bind: '{username}',
                emptyText: '用户名',
                blankText: '请填写用户名',
                triggers: {
                    glyphed: {
                        cls: 'trigger-glyph-noop auth-email-trigger'
                    }
                }
            },
            {
                xtype: 'textfield',
                cls: 'auth-textbox',
                height: 55,
                hideLabel: true,
                allowBlank: false,
                emptyText: '密码',
                name: 'password',
                inputType: 'password',
                blankText: '请填写密码',
                bind: '{password}',
                regex: /(?!^\\d+$)(?!^[a-zA-Z]+$).{8,15}/,
                regexText: '密码必须由字母和数字组合，且不能少于8个字符，不能多于15个字符',
                triggers: {
                    glyphed: {
                        cls: 'trigger-glyph-noop auth-password-trigger'
                    }
                }
            },
            {
                xtype: 'textfield',
                cls: 'auth-textbox',
                height: 55,
                hideLabel: true,
                allowBlank: false,
                emptyText: '姓名',
                blankText: '请填写姓名',
                name: 'fullName',
                bind: '{fullName}',
                maxLength: 32,
                triggers: {
                    glyphed: {
                        cls: 'trigger-glyph-noop auth-email-trigger'
                    }
                }
            },
            {
                xtype: 'textfield',
                cls: 'auth-textbox',
                height: 55,
                hideLabel: true,
                allowBlank: false,
                name: 'email',
                emptyText: '邮箱：user@example.com',
                blankText: '请填写邮箱',
                invalidText: '邮箱格式不正确',
                vtype: 'email',
                bind: '{email}',
                triggers: {
                    glyphed: {
                        cls: 'trigger-glyph-noop auth-envelope-trigger'
                    }
                }
            },
            {
                xtype: 'checkbox',
                flex: 1,
                name: 'agrees',
                cls: 'form-panel-font-color rememberMeCheckbox',
                height: 32,
                bind: '{agrees}',
                allowBlank: false,
                boxLabel: '是否同意协议？',
                isValid: function() {
                    var me = this;
                    return me.checked || me.disabled;
                }
            },
            {
                xtype: 'button',
                scale: 'large',
                ui: 'soft-blue',
                formBind: true,
                reference: 'submitButton',
                bind: false,
                margin: '5 0',
                iconAlign: 'right',
                iconCls: 'x-fa fa-angle-right',
                text: '注册',
                listeners: {
                    click: 'onSignupClick'
                }
            },
            {
                xtype: 'component',
                html: '<div style="text-align:right">' +
                    '<a href="#login" class="link-forgot-password">' +
                    '返回登录页 </a>' +
                    '</div>'
            }
        ]
    }]
});